<template>
 <div>
    <el-dialog
            :title="!course.id ? '新增' : '修改'"
            class="dialog"
            :visible.sync="visible"
            :before-close="handleClose">
            <div>
               
                <el-form :model="course" :rules="courseRule" ref="dataForm"  label-width="80px">
                    <el-form-item label="星期" prop="courseId">
                        <el-input v-model="course.week" readonly placeholder="学期"></el-input>
                    </el-form-item>
                    <el-form-item label="学年" prop="courseId">
                        <el-input v-model="course.classYear" placeholder="请输入学年"></el-input>
                    </el-form-item>
                    <el-form-item label="课程" prop="courseId">
                        <el-select filterable class="select" v-model="course.courseId">
                            <el-option  v-for="item in courses" :key="item.id" :label="item.courseName" :value="item.id"></el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="周次" prop="weekNumber">
                        <el-input v-model="course.weekNumber" placeholder="请输入周次信息"></el-input>
                    </el-form-item>
                    <el-form-item label="任课教师" prop="weekNumber">
                        <el-select filterable class="select" v-model="course.teacherId"  placeholder="请选择任课教师">
                            <el-option  v-for="item in teachers" :key="item.tid" :label="item.name" :value="item.tid"></el-option>
                        </el-select>
                       
                    </el-form-item>
                    <el-form-item label="教室" prop="weekNumber">
                        <el-row >
                            <el-col :span="11">
                                <el-select filterable class="select" v-model="build" @change="changeBuilder" placeholder="请选择楼栋">
                                    <el-option  v-for="item in builds" :key="item.id" :label="item.roomNumber" :value="item.id"></el-option>
                                </el-select>
                            </el-col>
                            <el-col :span="2">
                                <div style="fontSize:14px;line-height: 40px; text-align: center;"> :</div>
                            </el-col>
                            <el-col :span="11">
                                <el-select filterable  class="select" v-model="course.roomId" placeholder="请选择教室" >
                                    <el-option v-for="item in rooms" :key="item.id" :label="item.roomNumber" :value="item.id"></el-option>
                                </el-select>
                            </el-col>
                        </el-row>
                        
                    </el-form-item>
                </el-form>
            </div>
            <span slot="footer" class="dialog-footer">
                <el-button>取 消</el-button>
                <el-button type="primary" @click="submit">确 定</el-button>
            </span>
        </el-dialog>
 </div>
</template>

<script>
import { roomApi } from '@/api/baseinfo';
import { courseApi, curriculumApi } from '@/api/course';
import { teacherApi } from '@/api/teacher';
import { clone } from '@/utils';

 export default {
   data () {
     return {
        course: {
                "id": null,
                "courseId": null,
                "courseName": null,
                "week": null,
                "teacherId": null,
                "teacherName": null,
                "weekNumber": null,
                "classId": null,
                "type": 'class',
                "classTimes": null,
                "classYear": null,
                "roomId": null,
                "room": null,
            },
            builds:[],
            courses:[],
            teachers:[],
            rooms:[],
            build:null,
            courseRule:{},
            visible: false,

     }
   },
   created () {
    
   },methods: {
        init(data){
            this.course = clone(data);
            if(data.id){

            }
            roomApi.listbuild().then(({data})=>{
                this.builds=data
                return 
            }).then(()=>{
                roomApi.listClassroomNoPage().then(({data})=>{
                    this.rooms=data
                    return 
                })
            }).then(()=>{
                courseApi.listCourseNopage().then(({data})=>{
                    this.courses=data
                    return data;
                })
            }).then(()=>{
                teacherApi.searchTeacher().then(({data})=>{
                    this.teachers=data
                    return data;
                })
            })

            let date = new Date();
            let year = date.getFullYear()
            let month = date.getMonth()
            if(month>7){
                this.course.classYear = `${year}-${year+1}学年第一学期`
            }else{
                this.course.classYear = `${year-1}-${year}学年第二学期`
            }
            this.visible = true
        },
        handleClose(){
            this.$emit('refreshDataList')
        },
        changeBuilder(){
            roomApi.listClassroomNoPage({parentId:this.build})
            .then(({data})=>{
                this.rooms = data
            })
        },
        submit(){
            curriculumApi.saveOrUpdate(this.course,this.course.id?'update':'save')
            .then(res=>{
                this.$message({
                  message: '操作成功',
                  type: 'success',
                  duration: 1500,
                  onClose: () => {
                    this.visible = false
                    this.$emit('refreshDataList')
                  }
                })
            })
        }
   }
 }
</script>

<style lang="scss">
.dialog .el-dialog{
    max-width: 800px;
    min-width: 400px;
}
 
</style>
